page {
	background: #F8F8F8;
}

.success_comment {
	height: 100vh;
	overflow: hidden;

	.bg1 {
		width: 100%;
		height: 432rpx;
	}

	.pageTop {
		width: 750rpx;
		height: 278rpx;
		background: linear-gradient(135deg, #FF7733 0%, #FF4133 100%);
		border-radius: 0rpx 0rpx 32rpx 32rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		color: #F9C254;
		font-size: 40rpx;
		font-weight: bold;


		.icon {
			width: 160rpx;
			height: 160rpx;
			margin-right: 40rpx;
		}
	}

	.main {
		display: flex;
		flex-direction: column;
		width: 686rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		border: 2rpx solid #F2F2F2;
		margin: 0 auto;
		margin-top: 32rpx;
		padding: 24rpx 32rpx;
		box-sizing: border-box;


		.product {
			padding-bottom: 24rpx;
			border-bottom: 2rpx solid transparent;
			background: linear-gradient(white, white) padding-box, repeating-linear-gradient(-45deg, #e8e7e7 0, #e8e7e7 0.4em, white 0, white 0.6em);

			.van-card {
				padding: 0;
				font-size: 28rpx;
			}

			.van-card__thumb {
				width: 120rpx;
				height: 120rpx;
				margin-right: 24rpx;
			}

			.van-card__content {
				min-height: 0;
			}

			.van-card__title {
				display: -webkit-box; // 必须结合的属性 ，将对象作为弹性伸缩盒子模型显示 。
				-webkit-box-orient: vertical; // 必须结合的属性 ，设置或检索伸缩盒对象的子元素的排列方式 。
				-webkit-line-clamp: 2; // 用来限制在一个块元素显示的文本的行数。 为了实现该效果，它需要组合其他的WebKit属性。
				overflow: hidden;
			}
		}

		.contents {
			padding-top: 24rpx;

			.text {
				word-break: break-all;
			}

			.img_list {
				display: flex;
				justify-content: space-between;
				padding-top: 24rpx;

				image {
					width: 200rpx;
					height: 200rpx;
					border-radius: 20rpx;
				}
			}
		}
	}

	.btn {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 20rpx;
		padding: 32rpx;
		padding-bottom: env(safe-area-inset-bottom);
		width: 686rpx;
		height: 88rpx;
		border-radius: 44rpx 44rpx 44rpx 44rpx;
		opacity: 1;
		
		button{
			width: 686rpx;
			border: 2rpx solid #FF7733;
		}
	}
}

.Box_top {
	display: flex;

	.right {
		flex: 1;
		margin-left: 24rpx;

		.top {
			display: flex;
			justify-content: space-between;

			.name {
				width: 300rpx;
				font-size: 32rpx;
				font-weight: bold;
				color: #06021a;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			.status {
				font-size: 28rpx;
				color: #ff7733;
			}

			.failStatus {
				font-size: 28rpx;
				color: rgba(32, 35, 39, 0.7);
			}
		}

		.center {
			font-size: 28rpx;
			margin-top: 24rpx;
			color: #303030;
		}

		.bottom {
			margin-top: 12rpx;
			font-size: 28rpx;
			color: #06021A;

			text {
				font-weight: bold;
			}
		}
	}
}